<template>
	<view class="x-main-content">
		<u-navbar bgColor="#fff" :fixed="true" leftIconColor="#000" leftIconSize="42rpx" autoBack placeholder
				  title="注册医生">
		</u-navbar>
		<view class="container">
			<view style="background-color: #fff;margin-bottom: 20rpx;padding: 20rpx;border-radius: 20rpx;">
				<view style="font-size: 28rpx;color: #000;margin-bottom:20rpx ">请上传医生的营业执照</view>
				<view style="margin-bottom: 30rpx;font-size: 24rpx;color: #ababab;">请确保证件边框完整、字体清晰、亮度均匀，以便核验</view>
				<view class="" style="display: flex;justify-content: space-around;">
					<img :src="idCardPos" alt="" style="width: 202rpx;height: 140rpx;" @click="chooseImg('pos')" />
				</view>
			</view>
			<view style="background-color: #fff;padding: 20rpx;border-radius: 20rpx;">
				<view style="font-size: 28rpx;color: #000;padding: 20rpx 0;">医生信息</view>
				<u-form :model="form" ref="uForm" :label-style="labelStyle" errorType="toast">
					<u-form-item label="职业名称" borderBottom>
						<u-input v-model="form.professionName" placeholderClass="plaClass" placeholder="填写职业名称" border="none" disabled disabledColor="#ffffff"></u-input>
					</u-form-item>
					<u-form-item @click="goChooseHospital()" label="请选择医院" prop="hospital" borderBottom>
						<u-input v-model="form.hospital" disabled placeholderClass="plaClass"
								 disabledColor="#ffffff" placeholder="选择医院" border="none"></u-input>
						<u-icon slot="right" name="arrow-right"></u-icon>
					</u-form-item>
					<u-form-item @click="goChooseDepart()" label="请选择科室" prop="hospital" borderBottom>
						<u-input v-model="form.departmentName" disabled placeholderClass="plaClass"
								 disabledColor="#ffffff" placeholder="选择科室" border="none"></u-input>
						<u-icon slot="right" name="arrow-right"></u-icon>
					</u-form-item>
					<view
							style="font-size: 26rpx;color: #555;display: flex;justify-content: space-between;padding: 20rpx 0;">
						<text>有效期</text>
						<view>
							<text @click="showPick('start')" style="font-size:28rpx;color:#b1b9c9">{{cardStart}}</text>
							<text style="margin: 0 1px;color:#ababab">-</text>
							<text @click="showPick('end')" style="font-size:28rpx;color:#b1b9c9">{{cardEnd}}</text>
						</view>
					</view>
				</u-form>
			</view>
		</view>
		<view class="toConfirm">
			<view class="btn-confirm" @click="toConfirm">
				提交
			</view>
		</view>
		<view :show="pickerflag">
			<view v-if="pickerflag" @click="pickerflag = false" style="position: absolute;top: 0;left:0;width: 100%;height: 100%;background: #000;z-index: 99;opacity: 0.2"></view>
			<u-picker :show="pickerflag" :columns="showPickerList" :keyName="pickerType == 'depart' ? 'dictLabel' : 'doctorName'" @confirm="onConfirm" @cancel="isClose"></u-picker>
		</view>
		<u-datetime-picker ref="datetimePicker" :show="dateShow" mode="date" @cancel="dateCancel" @confirm="dateConfirm"
						   :minDate="minDate" :maxDate="maxDate">
		</u-datetime-picker>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				idCardPos: 'https://peiyiwang.obs.cn-east-3.myhuaweicloud.com:443/file%2F28570636452150534.png',
				pickerflag:false,
				showPickerList:[],
				pickerType:'',
				labelStyle: {
					color: '#333',
					fontSize: '14px',
					textAlign: 'left',
					fontWeight: '400',
					letterSpacing: '1px',
					fontFamily: 'PingFangSC - Regular,PingFang SC'
				},
				form: {
					professionName:"医生",
					hospital: "", //医院
					hospitalId: "",
					departmentId:"",
					departmentName:"",
				},
				dateShow: false,
				cardStart: '开始时间',
				cardEnd: '结束时间',
				flag: '',
				minDate: '',
				maxDate: '',
				posRes: '',

			}
		},
		onLoad() {

		},
		onShow() {
			this.getAuthStatus()
		},
		created() {
			uni.$on('hospital',this.resHospitall)
			uni.$on('patients',(patientSelection)=>{
				this.form.patients = patientSelection.name
				this.form.contactPhone = patientSelection.phone
				this.form.idCardNumber = patientSelection.idCard
			})
		},
		methods: {
			isClose() {
				this.pickerflag = false
			},
			onConfirm(e){
				let list = e.value
				if(this.pickerType == 'depart'){
					this.form.departmentId = list[0].parentId
					this.form.departmentName = list[0].dictLabel
				}
				this.pickerflag = false
			},
			resHospitall(hospital1){
				if(this.form.hospital != hospital1.name){
					this.form.departmentId = ''
					this.form.departmentName = ''
					this.form.doctorId = ''
					this.form.doctorName = ''
				}
				this.form.hospital = hospital1.name
				this.form.hospitalId = hospital1.id
			},
			goChooseHospital() {
				this.$u.route({
					url: 'pages/business/components/chooseHospitals'
				})
			},
			goChooseDepart(){
				if(!this.form.hospital){
					this.$u.toast('请先选择医院')
					return
				}
				this.pickerType = 'depart'
				this.getFirstDepartmentList()
				this.$nextTick(()=>{
					this.pickerflag = true
				})
			},
			async getFirstDepartmentList(){
				this.showPickerList = []
				let ret = await this.$request('/api/index/getFirstDepartmentList/' + this.form.hospitalId)
				this.showPickerList = [ret.data.data]
			},
			chooseImg(code) {
				uni.chooseImage({
					count: 1,
					success: res => {
						const tempFilePaths = res.tempFilePaths[0]
						console.log(tempFilePaths)
						if (code == 'pos') {
							this.idCardPos = tempFilePaths
						} else if (code == 'neg') {
							this.idCardNeg = tempFilePaths
						}
					}
				})
			},
			toConfirm() {
				if (!this.idCardPos || !this.form.hospital || !this.form.departmentId || this.cardStart == '开始时间' || this.cardEnd == '结束时间') {
					uni.showModal({
						title: '提示',
						content: '请将医生信息填写完整！'
					})
				} else {
					uni.showLoading({
						title: '提交中，请稍等…',
						mask: true
					})
					uni.uploadFile({
						url: "https://pyw.peiyiyiliao.com/prod-api/api/common/uploadFile",
						filePath: this.idCardPos,
						name: 'file',
						success: async res => {
							console.log(res)
							this.posRes = JSON.parse(res.data).data.url
                            const data = {
								departmentId: this.form.departmentId,
								hospitalId: this.form.hospitalId,
								professionImage: this.posRes,
								professionName: this.form.professionName,
								validDate: this.cardStart.replace(
										/-/g, ".") + '-' + this.cardEnd
										.replace(
												/-/g, ".")
                            }
                            let result = await this.$request('/api/user/submitJobAuth', data, 'POST','type')
                            console.log(result)
                            if(result.data.code !== 200){
                                this.$u.toast(result.data.msg)
                                return
                            }
							this.$u.toast(result.data.msg)
							setTimeout(()=>{
								uni.navigateBack({
									delta: 1
								});
							},1000)
						}
					})


					setTimeout(() => {
						uni.hideLoading()
					}, 2000)

					// console.log(this.cardStart.replace(/-/g, ".") + '-' + this.cardEnd.replace(/-/g, "."))
				}
			},
			showPick(code) {
				this.flag = code
				if (this.flag == 'start') {
					this.dateShow = true
					this.minDate = new Date('1950-01-01').getTime()
					this.maxDate = Number(new Date())
				} else {
					if (this.cardStart == '开始时间') {
						uni.showModal({
							'title': '提示',
							'content': '请先选择开始时间！'
						})
					} else {
						this.dateShow = true
						this.minDate = new Date(this.cardStart).getTime() + 24 * 60 * 60 * 1000
						this.maxDate = new Date('2099-12-31').getTime()
					}
				}
			},
			dateCancel() {
				this.dateShow = false
			},
			dateConfirm(e) {
				let res = uni.$u.timeFormat(e.value, 'yyyy-mm-dd')

				if (e.value) {
					this.dateShow = false
					if (this.flag == 'start') {
						this.cardStart = res
					} else {
						this.cardEnd = res
					}
				}
			},
		}
	}
</script>

<style lang="scss" scoped>
	.container {
		padding: 20rpx 40rpx;
	}

	.level-input {
		text-align: right;
	}

	.toConfirm {
		position: fixed;
		width: 100%;
		bottom: 60rpx;
		left: 0;
		display: flex;
		justify-content: center;

		.btn-confirm {
			padding: 12rpx 0;
			background-color: #386fff;
			font-size: 28rpx;
			color: #fff;
			border-radius: 30rpx;
			letter-spacing: 1px;
			width: 600rpx;
			text-align: center;
		}
	}
	/deep/.u-form-item__body__left{
		width: 112px !important;
	}
</style>